﻿<div style="margin-top:10px;background:red">div1</div>
<div style="margin-top:10px;background:red">div2</div>
<form class="layui-form" role="form" method="post">
    <div>
        <table style="width:100%" align="center">
            <tr>
                <td style="padding-bottom:20px;">
                    <input type="text" name="code" id="code" required lay-verify="required" style="border-radius:5px;" placeholder="验证码" class="layui-input">
                </td>
                <td style="padding-bottom:20px;padding-left:5px;cursor:pointer;width:90px;">
                    <img id="checkloing" src="/Login/VCode" title="看不清，换一张"
                         style="border: 1px solid #EEEEEE; border-radius: 5px;" />
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <button id="loginBtn" class="layui-btn layui-btn-lg layui-btn-normal" style="width: 98%; background-color: #00BFC1;" lay-submit lay-filter="loginBtn">立即登录</button>
                </td>
            </tr>
        </table>
    </div>
</form>

<script>
    layui.use('form', function () {
        var form = layui.form;
        var layer = layui.layer;
        var $ = layui.jquery
        //layui表单提交方法
        form.on('submit(loginBtn)', function (data) {
            var user = data.field;
            $.post('/TestAjax/Index', user, function (res) {
                console.log("提交了........"+res)
                if ("success" == res)//如果成功则跳转到指定页面
                    location.href = "/Home/";
                //location.href = "/pageChange/pageChange";
                else {//失败则弹出失败提示
                    layer.msg(res, {
                        offset: 1,
                        shift: 0,
                        area: ['100%', '50px'],
                        time: 3000,
                        scrollbar: false,
                    }, function () {//在登录失败时刷新验证码
                        var str = "?" + Math.random();//加上这句话可以解决验证码不刷新
                        $("#checkloing").attr("src", "/Login/VCode" + str);
                    });
                }
            });
            return false;
        });
    });
    //验证码点击事件
    $(document).ready(function (e) {
        $("#checkloing").click(function () {
            var str = "?" + Math.random();
            $(this).attr("src", "/Login/VCode" + str);
        })
    });
</script>